export const TemplateStr = `/**
* 参数说明
* data: { // 当前项的数据
       HighlightList: {}, // 高亮数据
       RawData: {} // 原始数据
   } 
* checkbox 复选框,开启多选才存在
*/

var style = '._listView {margin: 20px; display:inline-block;} ._listView th, ._listView td {text-align: left;border: 1px solid #000; padding: 5px} ._listView table {border-collapse:collapse;}';
var $style = document.createElement('style');
$style.innerHTML = style;
document.head.append($style);

// 列表视图
// import {Button} from 'antd' // web端时存在
// import {Button} from 'antd-mobile' // wap端时存在

function ListView({data, checkbox}){
    return <div className="_listView"><table>
         <thead>
             <tr>
                 <th>名称</th>
                 <th>值</th>
             </tr>
         </thead>
         <tbody>
            {
                data.RawData && Object.keys(data.RawData || {}).map(key => {
                     return <tr key={key}>
                         <td>{key.toString?.()}</td>
                         <td>{ data.HighlightList?.[key]?.toString() || data.RawData?.[key]?.toString() || ''}</td>
                     </tr>
                })
            }
         </tbody>
    </table></div>
 }
 
 // 缩略图视图
 function ThumbnailView() {}
 
 
 export {ListView, ThumbnailView}`;
